<template>
    <div class="container">
        <Breadcrumb :items="['系统管理', '用户列表']" />
        <a-card class="general-card" style="padding-top:20px">
            <a-row>
                <a-col :flex="1">
                    <a-form :model="formModel" label-align="right">
                        <a-row :gutter="16">
                            <a-space direction="horizontal" :size="12">
                                <a-form-item field="userName" label-col-flex="80px" label="用户姓名">
                                    <a-input v-model="formModel.userName.value" style="width: 240px;" placeholder="请输入用户姓名" />
                                </a-form-item>
                                <a-form-item field="phone" label-col-flex="80px" label="手机号">
                                    <a-input v-model="formModel.phone.value" style="width: 240px;" placeholder="请输入手机号" />
                                </a-form-item>
                                <a-form-item label-col-flex="0px" label="">
                                    <a-space direction="horizontal" :size="12">
                                        <a-button status="success" @click="fetchData">
                                            <template #icon>
                                                <icon-search />
                                            </template>
                                            查询
                                        </a-button>
                                        <a-button type="primary" status="warning" @click="addItem">
                                            <template #icon>
                                                <icon-plus />
                                            </template>
                                            新建
                                        </a-button>
                                    </a-space>
                                </a-form-item>
                            </a-space>
                        </a-row>
                    </a-form>
                </a-col>
            </a-row>
            <a-table :data="renderData" :pagination="true" :bordered="false">
                <template #columns>
                    <a-table-column title="用户ID" align="left" data-index="id">
                    </a-table-column>
                    <a-table-column title="姓名" align="center" data-index="realName">
                    </a-table-column>
                    <a-table-column title="手机号" align="center" data-index="phone">
                    </a-table-column>
                    <a-table-column title="责任部门" align="center" data-index="department">
                    </a-table-column>
                    <a-table-column title="牵头领导" align="center" data-index="project">
                    </a-table-column>
                    <a-table-column title="角色" align="center" data-index="userRole">
                    </a-table-column>
                    <a-table-column title="上次登录时间" align="center" data-index="lastLoginTime">
                    </a-table-column>
                    <a-table-column title="操作" align="center" :width="140" fixed="right">
                      <template #cell="{ record }">
                        <a-button type="outline" status="warning" shape="round" size="mini" @click="editItem(record)">
                          <template #default>编辑</template>
                        </a-button>
                        <a-button type="outline" status="danger" shape="round" style="margin-left: 7px;" size="mini" @click="deleteItem(record)">
                          <template #default>删除</template>
                        </a-button>
                      </template>
                    </a-table-column>
                </template>
            </a-table>

            <a-modal v-model:visible="addVisible" @ok="addSubmit" width="560px" title="新增用户信息">
                <a-row>
                    <a-form :model="addDataForm" layout="vertical" label-align="right">
                        <a-row>
                          <a-col>
                            <a-form-item field="realName" label-col-flex="100px" label="用户姓名" required>
                              <a-input v-model="addDataForm.realName.value" placeholder="请输入用户姓名" />
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="phone" label-col-flex="100px" label="手机号" required>
                                <a-input v-model="addDataForm.phone.value" placeholder="请输入手机号" />
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="userRole" label-col-flex="100px" label="角色" required>
                                <a-select v-model="addDataForm.userRole.value" placeholder="请选择角色">
                                  <a-option v-for="item in roleOptions" :key="item.value" :value="item.value">{{ item.label }}</a-option>
                                </a-select>
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="department" label-col-flex="100px" label="部门" required>
                                <a-input v-model="addDataForm.department.value" placeholder="请输入部门" />
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="project" label-col-flex="100px" label="牵头领导" required>
                              <a-input v-model="addDataForm.project.value" placeholder="请输入部门" />
                            </a-form-item>
                          </a-col>
                        </a-row>
                    </a-form>
                </a-row>
            </a-modal>


            <a-modal v-model:visible="editVisible" @ok="editSubmit" width="560px" title="编辑用户信息">
                <a-row>
                    <a-form :model="editDataForm" layout="vertical" label-align="right">
                        <a-row>
                          <a-col>
                            <a-form-item field="realName" label-col-flex="100px" label="用户姓名" required>
                              <a-input v-model="editDataForm.realName.value" placeholder="请输入用户姓名" />
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="phone" label-col-flex="100px" label="手机号" required>
                                <a-input v-model="editDataForm.phone.value" placeholder="请输入手机号" />
                            </a-form-item>
                          </a-col>
                          <!-- <a-col>
                            <a-form-item field="huangGangId" label-col-flex="100px" label="部门编码" required>
                                <a-input v-model="editDataForm.huangGangId.value" placeholder="请输入部门编码" />
                            </a-form-item>
                          </a-col> -->
                          <a-col>
                            <a-form-item field="department" label-col-flex="100px" label="部门" required>
                                <a-input v-model="editDataForm.department.value" placeholder="请输入部门" />
                            </a-form-item>
                          </a-col>
                          <a-col>
                            <a-form-item field="userRole" label-col-flex="100px" label="角色" required>
                                <!-- <a-input v-model="editDataForm.userRole.value" placeholder="请输入角色" /> -->
                                <a-select v-model="editDataForm.userRole.value" placeholder="请选择角色">
                                  <a-option v-for="item in roleOptions" :key="item.value" :value="item.value">{{ item.label }}</a-option>
                                </a-select>
                            </a-form-item>
                          </a-col>
                          
                          <a-col>
                            <a-form-item field="project" label-col-flex="100px" label="牵头领导" required>
                              <a-input v-model="editDataForm.project.value" placeholder="请输入部门" />
                            </a-form-item>
                          </a-col>
                        </a-row>
                    </a-form>
                </a-row>
            </a-modal>

        </a-card>
    </div>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { Modal, Message } from '@arco-design/web-vue';
import { postRequest, uploadFileRequest } from '@/api/common';
import { baseURL } from '@/api/base';
const formModel = {
    userName: ref(''),
    phone: ref(''),
    pageNum:1
};
const roleOptions:any[] = [
  { value: 'admin', label: '管理员' }
]

const projectOption:any[] = [
  {label: "农业服务", value: "agriculturalServices"},
  {label: "农村产权交易服务", value: "propertyTransactionData"},
  {label: "农业技术咨询服务/病虫预报", value: "pestsForecastingData"},
  {label: "农业技术咨询服务/在线学习", value: "onlineLearningData"},
  {label: "农业技术咨询服务/专家问诊", value: "expertConsultationData"},
  {label: "防止返贫动态监测对象认定", value: "investmentData"},
  {label: "耕地地力保护补贴", value: "investmentJiGai"},
  {label: "农机购置与应用补贴", value: "investmentKuData"},
  {label: "省十大重点农业产业链建设项目申报", value: "investmentKuList"},
  {label: "实际种粮农民一次性补贴", value: "investmentStaticPut"},
  {label: "市场主体贷款贴息", value: "investmentWeight"},
  {label: "市十大重点农业产业链建设项目申报", value: "investmentWeightList"},
  {label: "脱贫人口小额信贷", value: "investmentAgricultureData"},
  {label: "现代农业返乡下乡创业项目申报", value: "investmentCreditData"},
  {label: "雨露计划", value: "investmentRainData"},
  { label: "智慧殡葬", value: "funeralinterment" },
  { label: "便民服务", value: "convenientServiceData" },
  { label: "养老服务", value: "elderlyservices" },
  { label: "餐食服务", value: "mealServiceData" },
  { label: "助洁", value: "assistJieData" },
  { label: "健康护理", value: "healthCareData" },
  { label: "旅居康养", value: "travelWellnessData" },
  { label: "代办代购", value: "proxyPurchasingData" },
  { label: "生活照护", value: "lifeCareData" },
  { label: "机构养老", value: "institutionalElderlyData" },
  { label: "志愿服务", value: "volunteerServiceData" },
  { label: "失能照护", value: "disabilityCareData" },
  { label: "专业护工", value: "professionalCaregiverData" },
  { label: "农村养老服务", value: "ruralelderlyServicesData" },
  { label: "高龄津贴发放", value: "businessOpenList" },
  { label: "孤儿补贴", value: "businessPartList" },
  { label: "困难残疾人生活补贴", value: "disabledData" },
  { label: "特困人员认定", value: "destituteData" },
  { label: "重度残疾人护理补贴", value: "careData" },
  { label: "最低生活保障", value: "guaranteeData" },
  { label: "冈好购", value: "goodShopping" },
  { label: "冈好购", value: "goodShoppingData" },
  { label: "特色产业链", value: "goodIndustryChainShopping" },
  { label: "蕲艾供应链", value: "artemisiaArgyiData" },
  { label: "蛋鸡产业供应链", value: "eggData" },
  { label: "中药材供应链", value: "ChineseMedicineData" },
  { label: "茶叶供应链", value: "teaData" },
  { label: "金石链", value: "metalStoneData" },
  { label: "黑山羊供应链", value: "BlackSheepData" },
  { label: "优质稻供应链", value: "riceData" },
  { label: "再生资源链", value: "renewableResourcesData" },
  { label: "建材供应链", value: "buildingMaterialsData" },
  { label: "钢结构供应链", value: "steelStructureData" },
  { label: "纺织产业供应链", value: "textileIndustryData" },
  { label: "菊花供应链", value: "chrysanthemumData" },
  { label: "红苕供应链", value: "sweetPotatoData" },
  { label: "农民进城", value: "constructionfarmer" },
  { label: "购房服务/楼盘展示", value: "farmerconstructionAreaList" },
  { label: "购房服务/认购申报", value: "farmerconstructionIndustriesList" },
  { label: "进城购房/楼盘展示", value: "constructionAreaList" },
  { label: "进城购房/认购申报", value: "constructionIndustriesList" },
  { label: "受灾群众冬春救助", value: "affectedData" },
  { label: "因灾倒损居民住房恢复重建救助", value: "rebuildData" },
  { label: "住房维修加固救助", value: "maintenanceData" },
  { label: "住房重建补助", value: "housingData" },
  { label: "东坡庙会", value: "templefair" },
  { label: "看美景", value: "sceneryData" },
  { label: "品美食", value: "foodData" },
  { label: "住民宿", value: "homestayData" },
  { label: "购特产", value: "specialityData" },
  { label: "旅游出行", value: "travelData" },
  { label: "学生服务", value: "studentServices" },
  { label: "乘坐校车", value: "studentBusData" },
  { label: "课后服务", value: "afterClassData" },
  { label: "学生服务/农民进城", value: "farmerServices" },
  { label: "子女入学", value: "farmerChildrenData" },
  { label: "心理咨询", value: "psychologicalCounseling" },
  { label: "在线咨询", value: "onlineAskData" },
  { label: "社会协同", value: "socialCoordinationData" },
  { label: "乘坐校车", value: "schoolBusData" },
  { label: "子女入学", value: "enrollmentData" },
  { label: "残疾儿童康复救助家庭生活补助", value: "enterpriseData" },
  { label: "残疾儿童康复训练救助项目", value: "rehabilitationData" },
  { label: "残疾人辅助器具适配项目", value: "aidData" },
  { label: "残疾人证办理", value: "handleData" },
  { label: "邻里服务", value: "federationNeighborhoodServices" },
  { label: "群团组织下沉/我的工会我的家", value: "massOrganizationData" },
  { label: "农业服务", value: "financeagricultureServices" },
  { label: "农村资源抵押贷款", value: "mortgageLoanData" },
  { label: "生态公益林补偿资金", value: "controversyAreaList" },
  { label: "生态护林员补助资金", value: "controversyIndustriesList" },
  { label: "天然林禁伐补助资金", value: "loggingData" },
  { label: "政策性森林保险", value: "forestData" },
  { label: "中央财政造林补助项目", value: "afforestationData" },
  { label: "健康服务", value: "healthServices" },
  { label: "市民点单（仅市区）", value: "citizenOrderingData" },
  { label: "网上就医", value: "onlineMedicalData" },
  { label: "冈好药", value: "goodMedicineData" },
  { label: "家庭健康档案（仅市区）", value: "healthRecordsData" },
  { label: "计划生育家庭特别扶助", value: "familyPlanningData" },
  { label: "农村部分计划生育家庭奖励扶助", value: "fertilityRewardsData" },
  { label: "农民进城", value: "farmerhousingServices" },
  { label: "购房服务/公积金服务", value: "farmerHousingData" },
  { label: "农民工法律援助", value: "judicialStaticPut" },
  { label: "邻里服务", value: "neighbourhoodService" },
  { label: "法律服务", value: "legalServiceData" },
  { label: "农民进城", value: "sifaneighbourhoodService" },
  { label: "农民工法律援助", value: "farmerlegalAidData" },
  { label: "农民进城", value: "medicalfarmer" },
  { label: "医保服务/呼叫客服", value: "callCustomerData" },
  { label: "医保服务/参保登记及变更", value: "farmerChangeData" },
  { label: "医保服务/生育待遇", value: "maternityBenefitsData" },
  { label: "医保服务/新生儿参保", value: "newbornInsuranceData" },
  { label: "常驻异地工作医保备案", value: "allopatryData" },
  { label: "救助对象（零星）医保报销", value: "scatteredData" },
  { label: "救助对象医保缴费补贴", value: "rescueTargetData" },
  { label: "居民医保参保登记", value: "insuranceRegistrationData" },
  { label: "居民医保参保信息变更", value: "informationChangeData" },
  { label: "临时外出就医医保备案", value: "temporaryOutingData" },
  { label: "慢特病病种待遇认定", value: "chronicDiseasesData" },
  { label: "异地安置退休医保备案", value: "retireData" },
  { label: "异地长期居住医保备案", value: "longResidenceData" },
  { label: "异地转诊医保备案", value: "referralData" },
  { label: "邻里服务", value: "organizationNeighborhoodServices" },
  { label: "我要建言", value: "adviceData" },
  { label: "网上代表联络站", value: "onlinerepresentative" },
  { label: "找代表", value: "representativeData" },
  { label: "立法/监督工作意见征集", value: "collectOpinionsData" },
  { label: "查留言", value: "checkMessageData" },
  { label: "劳务市场", value: "labormarket" },
  { label: "打短工", value: "casualLaborerData" },
  { label: "要培训", value: "toTrainData" },
  { label: "找工作", value: "jobHuntingData" },
  { label: "农民进城", value: "farmersCity" },
  { label: "就业补贴", value: "jobSubsidiesData" },
  { label: "社保服务", value: "securityServicesData" },
  { label: "农业服务", value: "agriculturalservices" },
  { label: "农民培训", value: "farmertraining" },
  { label: "城乡居民养老保险参保登记", value: "consumptionData" },
  { label: "创业担保贷款", value: "loanData" },
  { label: "返乡创业一次性补贴", value: "disposableData" },
  { label: "居民参保缴费补贴", value: "payData" },
  { label: "灵活就业社保补贴身份认定", value: "employmentData" },
  { label: "农民进城参保", value: "insuredData" },
  { label: "农民进城社保补贴", value: "farmerinsuredData" },
  { label: "农民培训", value: "trainingData" },
  { label: "失业金申领", value: "unemploymentData" },
  { label: "人民建议征集", value: "peoplesuggestion" },
  { label: "日常收集", value: "dailyCollectionData" },
  { label: "主题征集", value: "themeCollectionData" },
  { label: "专题征集", value: "topicCollectionData" },
  { label: "问卷调查", value: "questionNaireData" },
  { label: "建议查询", value: "suggestedInquiryData" },
  { label: "优秀建议", value: "excellentSuggestionData" },
  { label: "成果展示", value: "achievementExhibitionData" },
  { label: "活动展示", value: "eventDisplayData" },
  { label: "他山之石", value: "outsideBoxData" },
  { label: "冈好运", value: "goodtransportation" },
  { label: "冈好运", value: "transportation" },
  { label: "冷链专业物流设施建设补贴", value: "IndustrialAreaData" },
  { label: "农村客运费改税补贴", value: "industrialEletrList" },
  { label: "新能源公交车辆运营补贴", value: "IndustrialPointerData" },
  { label: "镇村物流综合服务网点运营补贴", value: "industrialPointList" },
  { label: "原迁移民直补资金发放", value: "migrationData" }
]


const addVisible = ref(false);
const addDataForm = {
    realName: ref(''),
    phone: ref(''),
    department: ref(''),
    project: ref(''),
    userRole: ref(''),
    huangGangId:ref(''),
    area: ref(''),
}
const addItem = () => {
    addVisible.value = true;
    addDataForm.realName.value = '';
    addDataForm.phone.value = '';
    addDataForm.project.value = '';
    addDataForm.department.value = '';
    addDataForm.userRole.value = '';
    addDataForm.area.value = '';
};
const addSubmit = async() => {
    let res = await postRequest("dsms/jyData/addUser", {
    realName:addDataForm.realName.value,
    phone:addDataForm.phone.value,
    project:addDataForm.project.value,
    department:addDataForm.department.value,
    userRole:addDataForm.userRole.value,
    area:addDataForm.area.value
  });
  console.log(res);
  fetchData();
};

const deleteItem = async(record: any) => {
    Modal.warning({
        title:"是否确认删除",
        titleAlign:"center",
        content: '此操作会永久删除该用户,是否确认要删除?',
        hideCancel:false,
        onOk(){
           postRequest("dsms/jyData/deleteUserById/"+record.id,{}).then(res=>{
                fetchData();
           })
        }
    })
};


const editVisible = ref(false);
const editDataForm = {
    id: ref(''),
    realName: ref(''),
    phone: ref(''),
    project: ref(''),
    department: ref(''),
    userRole: ref(''),
    huangGangId:ref(''),
    area: ref(''),
}

function editItem(record: any) {
    editVisible.value = true;
    editDataForm.id.value = record.id;
    editDataForm.realName.value = record.realName;
    editDataForm.phone.value = record.phone;
    editDataForm.project.value = record.project;
    editDataForm.department.value = record.department;
    editDataForm.userRole.value = record.userRole;
    editDataForm.area.value = record.area;
}
const editSubmit = async() => {
  let res = await postRequest("dsms/jyData/editUser", {
    id: editDataForm.id.value,
    realName:editDataForm.realName.value,
    phone:editDataForm.phone.value,
    project:editDataForm.project.value,
    department:editDataForm.department.value,
    userRole:editDataForm.userRole.value,
    area:editDataForm.area.value
  });
  console.log(res);
  fetchData();
};

let renderData = ref<any[]>([]);
const fetchData = async () => {
  let res = await postRequest("dsms/jyData/getUserList", {
    name:formModel.userName.value,
    phone:formModel.phone.value,
    pageSize:999
  });
  console.log(res);
  renderData.value = res;
}
fetchData();
</script>
<script lang="ts">
export default {
    name: 'userList',
};
</script>
  
<style scoped lang="less">
.container {
    padding: 0 20px 20px 20px;
}
</style>
  